<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>提交记录</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/layui/2.6.8/css/layui.css"  media="all">
    <script type="text/javascript" src="/jquery/dist/jquery.min.js"></script>
    <script>
        var information = {thing:"init",num:"0"};//初始化页面
        $.ajax({
            type:'POST',
            data:JSON.stringify(information),
            dataType:'json',
            contentType:'application/json',
            url:'/submitLogD',
            success :function (data) {
                console.log(data);
                var arrayObj = data.array;
                //console.log(arrayObj);
                sessionStorage.setItem("top", data.top);//更新top
                console.log(sessionStorage.getItem("top"));
                var str = '';
                $("#test").empty();
                $.each(arrayObj, function (i, obj){
                    /*                  console.log(i);
                                        console.log(obj);*/
                    str += '<tr>';
                    str += '<td>'+ obj["RunID"] +'</td>';
                    str += '<td>'+ obj["User"] + '</td>';
                    str += '<td>'+ '<a href=/submitPage/' + obj["ProblemID"] +'>' + obj["ProblemID"] + '</td>';
                    str += '<td>'+ obj["SubmitTime"] + '</td>';
                    str += '<td>'+ '<a href=' + obj["FilePath"] + '>' + '查看代码</td>';
                    str += '<td>'+ '<span class="layui-badge layui-bg-cyan">' + obj["Status"] + '</td>';
                    str += '</tr>';
                });
                $("#test").append(str);
            }
        });
    </script>

</head>

<body>

<div class="layui-container">
    <div class="layui-row layui-col-space10">
        <div class="layui-col-md12">
            <div class="layui-col-md12">
                <ul class="layui-nav layui-bg-green" lay-filter="menu">
                    <li class="layui-nav-item"><a href="index.html">YCOJ</a></li>
                    <li class="layui-nav-item"><a href="index.html">Home</a></li>
                    <li class="layui-nav-item layui-this"><a href="problem.html">Problem Set</a></li>
                    <li class="layui-nav-item"><a href="">Contest</a></li>
                    <li class="layui-nav-item"><a href="status.html">Status</a></li>
                    <li class="layui-nav-item"><a href="">FAQ</a></li>
                    <li class="layui-nav-item">
                        <a href="javascript:;">个人中心</a>
                        <dl class="layui-nav-child"> <!-- 二级菜单 -->
                            <dd><a href="submitLog.html">提交记录</a></dd>
                            <dd><a href="accountManageD.html">账号管理</a></dd>
                        </dl>
                    </li>
                </ul>
            </div>
        </div>

        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
            <legend>提交记录</legend>
        </fieldset>

        <div class="layui-col-md12 layui-col-space10">
            <div class="layui-col-md12">
                <div class="layui-card-header layui-bg-blue" align="center">提交列表</div>
                <table class="layui-table" lay-even lay-skin="nob">
                    <colgroup>
                        <col width="150">
                        <col width="200">
                        <col>
                    </colgroup>
                    <thead>
                    <tr>
                        <th>RunID</th>
                        <th>用户</th>
                        <th>题号</th>
                        <th>提交时间</th>
                        <th>提交代码</th>
                        <th>提交结果</th>
                    </tr>
                    </thead>
                    <tbody id="test">

                    <!-- <tr>
                         <td>{{RunID}}</td>
                         <td>{{User}}</td>
                         <td><a href="/submitPage/{{ProblemID}}"></a> {{ProblemID}}</td>
                         <td>{{SubmitTime}}</td>
                         &lt;!&ndash;动态渲染的页面&ndash;&gt;
                         <td><a href="">查看代码</a> </td>
                         <td>{{Status}}</td>
                     </tr>-->
                    </tbody>
                </table>

                <div class="layui-form-item" class="layui-col-md12">
                    <button class="layui-btn layui-btn-fluid" lay-submit="" lay-filter="UpButton" onclick="Uppage();">上&nbsp;&nbsp;&nbsp;&nbsp;页</button>
                    <br>
                    <br>
                    <button class="layui-btn layui-btn-fluid" lay-submit="" lay-filter="DownButton" onclick="DownPage();">下&nbsp;&nbsp;&nbsp;&nbsp;页</button>
                </div>
            </div>
            <br>
        </div>

    </div>
</div>


<script>
    function Uppage() {
// 先读取
        var information = {thing:"prev", num:sessionStorage.getItem("top")};
// 再发送
// 之前的页面都采用后端渲染，这里采用前端渲染
        $.ajax({
            type:'POST',
            data:JSON.stringify(information),
            dataType:'json',
            contentType:'application/json',
            url:'/submitLogD',
            success :function (data) {
                console.log(data);
                var arrayObj = data.array;
                //console.log(arrayObj);
                sessionStorage.setItem("top", data.top);//更新top
                console.log(sessionStorage.getItem("top"));
                var str = '';
                $("#test").empty();
                $.each(arrayObj, function (i, obj){
                    //console.log(i);
                    //console.log(obj);
                    str += '<tr>';
                    str += '<td>'+ obj["RunID"] +'</td>';
                    str += '<td>'+ obj["User"] + '</td>';
                    str += '<td>'+ '<a href=/submitPage/' + obj["ProblemID"] +'>' + obj["ProblemID"] + '</td>';
                    str += '<td>'+ obj["SubmitTime"] + '</td>';
                    str += '<td>'+ '<a href=' + obj["FilePath"] + '>' + '查看代码</td>';
                    str += '<td>'+ '<span class="layui-badge layui-bg-cyan">' + obj["Status"] + '</td>';
                    str += '</tr>';
                });
                $("#test").append(str);
            }
        });
    }
    function  DownPage() {
// 先读取
        var information = {thing:"next", num:sessionStorage.getItem("top")};
// 再发送
// 之前的页面都采用后端渲染，这里采用前端渲染
        $.ajax({
            type:'POST',
            data:JSON.stringify(information),
            dataType:'json',
            contentType:'application/json',
            url:'/submitLogD',
            success :function (data) {
                console.log(data);
                var arrayObj = data.array;
                //console.log(arrayObj);
                sessionStorage.setItem("top", data.top);//更新top
                console.log(sessionStorage.getItem("top"));
                var str = '';
                $("#test").empty();
                $.each(arrayObj, function (i, obj){
                    //console.log(i);
                    //console.log(obj);
                    str += '<tr>';
                    str += '<td>'+ obj["RunID"] +'</td>';
                    str += '<td>'+ obj["User"] + '</td>';
                    str += '<td>'+ '<a href=/submitPage/' + obj["ProblemID"] +'>' + obj["ProblemID"] + '</td>';
                    str += '<td>'+ obj["SubmitTime"] + '</td>';
                    str += '<td>'+ '<a href=' + obj["FilePath"] + '>' + '查看代码</td>';
                    str += '<td>'+ '<span class="layui-badge layui-bg-cyan">' + obj["Status"] + '</td>';
                    str += '</tr>';
                });
                $("#test").append(str);

            }
        });
    }
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/layui/2.6.8/layui.js" charset="utf-8"></script>
<script>
    //注意：导航 依赖 element 模块，否则无法进行功能性操作
    layui.use('element', function(){
        var element = layui.element;//导航的hover效果、二级菜单等功能，需要依赖element模块

        //一些事件触发
        //监听导航点击的回调
        element.on('nav(menu)',function (elem) {
            //console.log(elem);
            layer.msg(elem.text());
        });
    });
</script>


</body>
</html>